<template>
    <section class="drag-container">
        拖拽组件
        <DragCheckBox :option="option"></DragCheckBox>
        <el-button type="primary" @click="resultShow">选择结果</el-button>
    </section>
</template>


<script lang="ts" setup>
import { ref, reactive } from 'vue'
import DragCheckBox from "@/components/drag/drag-checkbox.vue";


const option = reactive<any>({
    allitems: ["a", "b", "c", "d", "e", "f", "g", "h", "i"],
    checkitems: ["a", "b", "i", "d"],
});


const resultShow = () => {
    var temp = [];
    const ws = new Set();
    option.checkitems.forEach((el: unknown) => {
        ws.add(el);
    });
    temp = option.allitems.filter((item: string) => ws.has(item));
    console.log(temp);
}
</script>


<style scoped>
.drag-container {
    padding: 20px;
}
</style>
